function hexToRgba(baseColor: string, a: number): string {
    // @ts-ignore
    if (baseColor.includes('#')) {
        // 去掉前导的#
        baseColor = baseColor.replace(/^#/, '');
        // 解析r、g、b
        let bigint = parseInt(baseColor, 16);
        let r = (bigint >> 16) & 255;
        let g = (bigint >> 8) & 255;
        let b = bigint & 255;
        return `rgb(${r}, ${g}, ${b}, ${a})`;
    }
    // @ts-ignore
    else if (baseColor.includes('rgba')) {
        const d = baseColor.match(/^rgba\((\d+),\s*(\d+),\s*(\d+),\s*(\d+)\)$/);
        if (d) {
            return `rgba(${d[1]}, ${d[2]}, ${d[3]}, ${a})`;
        }
    }
    // @ts-ignore
    else if (baseColor.includes('rgb')) {
        const d = baseColor.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
        if (d) {
            return `rgb(${d[1]}, ${d[2]}, ${d[3]}, ${a})`;
        }
    }
}

/**
 * 修改 element-plus的颜色主题
 */
function updateElementPlusTheme(type: string, baseColor: string): void {
    // 针对 element-plus 进行修改
    const colorArray: Record<string, string>[] = [
        {className: `--el-color-${type}`, color: baseColor},
        {className: `--el-color-${type}-dark-2`, color: hexToRgba(baseColor, 0.8)},
        {className: `--el-color-${type}-light-3`, color: hexToRgba(baseColor, 1 - 0.3)},
        {className: `--el-color-${type}-light-5`, color: hexToRgba(baseColor, 1 - 0.5)},
        {className: `--el-color-${type}-light-7`, color: hexToRgba(baseColor, 1 - 0.7)},
        {className: `--el-color-${type}-light-8`, color: hexToRgba(baseColor, 1 - 0.78)},
        {className: `--el-color-${type}-light-9`, color: hexToRgba(baseColor, 1 - 0.85)},
    ]

    colorArray.forEach(item => {
        document.documentElement.style.setProperty(item.className, item.color);
    })
}


/**
 * 重置 element-plus的颜色主题
 */
function resetElementPlusTheme(theme: string): void {
    const colorDarkArray: Record<string, string>[] = [
        {className: `--el-color-primary`, color: '#409eff'},
        {className: `--el-color-primary-dark-2`, color: 'rgb(102.2, 177.4, 255)'},
        {className: `--el-color-primary-light-3`, color: 'rgb(50.8, 116.6, 184.5)'},
        {className: `--el-color-primary-light-5`, color: 'rgb(42, 89, 137.5)'},
        {className: `--el-color-primary-light-7`, color: 'rgb(33.2, 61.4, 90.5)'},
        {className: `--el-color-primary-light-8`, color: 'rgb(28.8, 47.6, 67)'},
        {className: `--el-color-primary-light-9`, color: 'rgb(24.4, 33.8, 43.5)'},
        {className: `--el-color-success`, color: '#67c23a'},
        {className: `--el-color-success-dark-2`, color: 'rgb(133.4, 206.2, 97.4)'},
        {className: `--el-color-success-light-3`, color: 'rgb(78.1, 141.8, 46.6)'},
        {className: `--el-color-success-light-5`, color: 'rgb(61.5, 107, 39)'},
        {className: `--el-color-success-light-7`, color: 'rgb(44.9, 72.2, 31.4)'},
        {className: `--el-color-success-light-8`, color: 'rgb(36.6, 54.8, 27.6)'},
        {className: `--el-color-success-light-9`, color: 'rgb(28.3, 37.4, 23.8)'},
        {className: `--el-color-warning`, color: '#e6a23c'},
        {className: `--el-color-warning-dark-2`, color: 'rgb(235, 180.6, 99)'},
        {className: `--el-color-warning-light-3`, color: 'rgb(167, 119.4, 48)'},
        {className: `--el-color-warning-light-5`, color: '#7d5b28'},
        {className: `--el-color-warning-light-7`, color: 'rgb(83, 62.6, 32)'},
        {className: `--el-color-warning-light-8`, color: 'rgb(62, 48.4, 28)'},
        {className: `--el-color-warning-light-9`, color: 'rgb(41, 34.2, 24)'},
        {className: `--el-color-danger`, color: '#f56c6c'},
        {className: `--el-color-danger-dark-2`, color: 'rgb(247, 137.4, 137.4)'},
        {className: `--el-color-danger-light-3`, color: 'rgb(177.5, 81.6, 81.6)'},
        {className: `--el-color-danger-light-5`, color: 'rgb(132.5, 64, 64)'},
        {className: `--el-color-danger-light-7`, color: 'rgb(87.5, 46.4, 46.4)'},
        {className: `--el-color-danger-light-8`, color: 'rgb(65, 37.6, 37.6)'},
        {className: `--el-color-danger-light-9`, color: 'rgb(42.5, 28.8, 28.8)'},
        {className: `--el-color-error`, color: '#f56c6c'},
        {className: `--el-color-error-dark-2`, color: 'rgb(247, 137.4, 137.4)'},
        {className: `--el-color-error-light-3`, color: 'rgb(177.5, 81.6, 81.6)'},
        {className: `--el-color-error-light-5`, color: 'rgb(132.5, 64, 64)'},
        {className: `--el-color-error-light-7`, color: 'rgb(87.5, 46.4, 46.4)'},
        {className: `--el-color-error-light-8`, color: 'rgb(65, 37.6, 37.6)'},
        {className: `--el-color-error-light-9`, color: 'rgb(42.5, 28.8, 28.8)'},
        {className: `--el-color-info`, color: '#909399'},
        {className: `--el-color-info-dark-2`, color: 'rgb(166.2, 168.6, 173.4)'},
        {className: `--el-color-info-light-3`, color: 'rgb(106.8, 108.9, 113.1)'},
        {className: `--el-color-info-light-5`, color: 'rgb(82, 83.5, 86.5)'},
        {className: `--el-color-info-light-7`, color: 'rgb(57.2, 58.1, 59.9)'},
        {className: `--el-color-info-light-8`, color: 'rgb(44.8, 45.4, 46.6)'},
        {className: `--el-color-info-light-9`, color: 'rgb(32.4, 32.7, 33.3)'},
    ]
    const colorLightArray: Record<string, string>[] = [
        {className: `--el-color-primary`, color: '#409eff'},
        {className: `--el-color-primary-dark-2`, color: 'rgb(51.2, 126.4, 204)'},
        {className: `--el-color-primary-light-3`, color: 'rgb(121.3, 187.1, 255)'},
        {className: `--el-color-primary-light-5`, color: 'rgb(159.5, 206.5, 255)'},
        {className: `--el-color-primary-light-7`, color: 'rgb(197.7, 225.9, 255)'},
        {className: `--el-color-primary-light-8`, color: 'rgb(216.8, 235.6, 255)'},
        {className: `--el-color-primary-light-9`, color: 'rgb(235.9, 245.3, 255)'},
        {className: `--el-color-success`, color: '#67c23a'},
        {className: `--el-color-success-dark-2`, color: 'rgb(82.4, 155.2, 46.4)'},
        {className: `--el-color-success-light-3`, color: 'rgb(148.6, 212.3, 117.1)'},
        {className: `--el-color-success-light-5`, color: 'rgb(179, 224.5, 156.5)'},
        {className: `--el-color-success-light-7`, color: 'rgb(209.4, 236.7, 195.9)'},
        {className: `--el-color-success-light-8`, color: 'rgb(224.6, 242.8, 215.6)'},
        {className: `--el-color-success-light-9`, color: 'rgb(239.8, 248.9, 235.3)'},
        {className: `--el-color-warning`, color: '#e6a23c'},
        {className: `--el-color-warning-dark-2`, color: 'rgb(184, 129.6, 48)'},
        {className: `--el-color-warning-light-3`, color: 'rgb(237.5, 189.9, 118.5)'},
        {className: `--el-color-warning-light-5`, color: 'rgb(242.5, 208.5, 157.5)'},
        {className: `--el-color-warning-light-7`, color: 'rgb(247.5, 227.1, 196.5)'},
        {className: `--el-color-warning-light-8`, color: 'rgb(250, 236.4, 216)'},
        {className: `--el-color-warning-light-9`, color: 'rgb(252.5, 245.7, 235.5)'},
        {className: `--el-color-danger`, color: '#f56c6c'},
        {className: `--el-color-danger-dark-2`, color: 'rgb(196, 86.4, 86.4)'},
        {className: `--el-color-danger-light-3`, color: 'rgb(248, 152.1, 152.1)'},
        {className: `--el-color-danger-light-5`, color: 'rgb(250, 181.5, 181.5)'},
        {className: `--el-color-danger-light-7`, color: 'rgb(252.5, 210.9, 210.9)'},
        {className: `--el-color-danger-light-8`, color: 'rgb(253, 225.6, 225.6)'},
        {className: `--el-color-danger-light-9`, color: 'rgb(254, 240.3, 240.3)'},
        {className: `--el-color-error`, color: '#f56c6c'},
        {className: `--el-color-error-dark-2`, color: 'rgb(196, 86.4, 86.4)'},
        {className: `--el-color-error-light-3`, color: 'rgb(248, 152.1, 152.1)'},
        {className: `--el-color-error-light-5`, color: 'rgb(250, 181.5, 181.5)'},
        {className: `--el-color-error-light-7`, color: 'rgb(252.5, 210.9, 210.9)'},
        {className: `--el-color-error-light-8`, color: 'rgb(253, 225.6, 225.6)'},
        {className: `--el-color-error-light-9`, color: 'rgb(254, 240.3, 240.3)'},
        {className: `--el-color-info`, color: '#909399'},
        {className: `--el-color-info-dark-2`, color: 'rgb(115.2, 117.6, 122.4)'},
        {className: `--el-color-info-light-3`, color: 'rgb(106.8, 108.9,113.1)'},
        {className: `--el-color-info-light-5`, color: 'rgb(199.5, 201, 204)'},
        {className: `--el-color-info-light-7`, color: 'rgb(221.7, 222.6, 224.4)'},
        {className: `--el-color-info-light-8`, color: 'rgb(232.8, 233.4, 234.6)'},
        {className: `--el-color-info-light-9`, color: 'rgb(243.9, 244.2, 244.8)'},
    ]
    const colorArray = theme === 'dark' ? colorDarkArray : colorLightArray;
    colorArray.forEach(item => {
        document.documentElement.style.setProperty(item.className, item.color);
    })
}


export {
    updateElementPlusTheme,
    resetElementPlusTheme
}